@charset "utf-8";
@import "init";
@import "common";
.web {
    font-size: 16px;
    font-family: "微软雅黑";
    header {
        padding: 0 r(22);
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: r(17);
        height: r(123);
        .back {
            width: r(123);
            height: r(57);
            line-height: r(57);
            text-align: center;
            border: 2px solid $bg_color;
            border-radius: 15px;
            p {
                font-size: r(26);
                color: #000;
            }
        }
        .search_box2 {
            p {
                font-size: r(26);
            }
        }
        .city_box2 {
            i {
                color: $bg-color;
                font-size: r(48);
            }
        }
    }
    main {
        width: 100%;
        overflow-y: auto;
        position: absolute;
        left: 0;
        top: r(150);
        bottom: r(135);
        .main_landing {
            margin: r(25) r(24);
            display: flex;
            justify-content: space-between;
            align-items: center;
            .main_landing_left {
                display: flex;
                align-items: center;
                .main_landing_head {
                    width: r(168);
                    height: r(170);
                    overflow: hidden;
                    border-radius: 50%;
                    img {
                        width: 100%;
                    }
                }
                div {
                    padding-left: r(25);
                    a {
                        font-size: r(30);
                        color: #000;
                    }
                    p {
                        padding-top: r(38);
                        font-size: r(26);
                        color: $text-color;
                    }
                }
            }
            .main_landing_right {
                span {
                    font-size: r(88);
                    color: #000;
                }
            }
        }
        .main_img {
            padding: 0 r(24) r(35);
            display: flex;
            justify-content: space-between;
            .main_img_box {
                width: r(194);
                height: r(148);
                background-color: #b2e0a0;
                text-align: center;
                display: flex;
                justify-content: center;
                align-items: center;
                &:nth-of-type(2) {
                    background-color: #a0dce0;
                }
                &:nth-of-type(3) {
                    background-color: #e0b7a0;
                }
                .box_icon {
                    a {
                        color: #000;
                        i {
                            font-size: r(80);
                            color: white;
                        }
                        p {
                            font-size: r(26);
                        }
                    }
                }
            }
        }
        .main_title {
            padding: 0 r(24) r(26);
            display: flex;
            justify-content: space-between;
            align-items: center;
            &:nth-of-type(7) {
                padding: r(78) r(24) r(26);
            }
            .main_title_left {
                a {
                    display: flex;
                    align-items: center;
                    color: #000;
                    i {
                        font-size: r(54);
                        color: #ef9c0a;
                    }
                    .bg {
                        color: $bg-color;
                    }
                    .bg2 {
                        color: #ff9344;
                    }
                    .bg3 {
                        color: #b2e0a0;
                    }
                    .bg4 {
                        color: #9fdce0;
                    }
                    p {
                        padding-left: r(12);
                        font-size: r(30);
                        color: #000;
                    }
                }
            }
            .main_title_right {
                a {
                    display: flex;
                    align-items: center;
                    i {
                        font-size: r(25);
                        color: $bg-color;
                    }
                    p {
                        padding-right: r(10);
                        font-size: r(30);
                        color: #000;
                    }
                }
            }
        }
        .main_footer {
            padding: r(15) r(108);
            display: flex;
            justify-content: space-between;
            .main_footer_left {
                width: r(147);
                height: r(76);
                background-color: $bg-color;
                border-radius: r(50);
                line-height: r(76);
                text-align: center;
                a {
                   
                    font-size: r(24);
                    color: white;
                }
            }
            .main_footer_right {
                width: r(147);
                height: r(76);
                background-color: $bg-color;
                border-radius: r(50);
                line-height: r(76);
                text-align: center;
                a {
                    font-size: r(24);
                    color: white;
                }
            }
        }
    }
}